<template>
    <el-dialog
        :visible="quitOrderFlag"
        width="65%"
        center
        @close="clonseDialog"
        :close-on-click-modal="false"
        :destroy-on-close="true"
    >
        <span slot="title">退单申请</span>
        <!-- 工单基本信息 -->
        <div class="content">
            <div class="base_info">
                <div>工单编号：{{ quitForDialog.workOrderNo }}</div>
                <div>工单名称：{{ quitForDialog.orderProjectName }}</div>
                <div>工程面积：{{ quitForDialog.renovationTotalArea }}</div>
            </div>
            <div class="base_info">
                <div>工程地址： {{ quitForDialog.orderProjectAddress }}</div>
                <div>甲方联系人：{{ quitForDialog.followUpEmp }}</div>
                <div>甲方联系电话：{{ quitForDialog.followUpPhone }}</div>
            </div>
            <!-- 退单原因 -->
            <div class="quit_reason">
                <el-input
                    v-model="quitForDialog.chargebackReason"
                    type="textarea"
                    maxlength="200"
                    :rows="3"
                    placeholder="请输入退单原因"
                ></el-input>
            </div>
        </div>
        <span slot="footer" class="dialog-footer">
            <el-button @click="clonseDialog">取 消</el-button>
            <el-button type="primary" @click="quitOrder" v-if="quitForDialog.canChargeBack">提 交</el-button>
        </span>
    </el-dialog>
</template>

<script lang="ts">
import QuitDialog from './QuitDialog.js';
export default {
    ...QuitDialog
};
</script>

<style scoped lang="less">
@import './QuitDialog.less';
</style>
